<!--
 * @jixuanyu: jixuanyu
 * @Date: 2022-06-29 16:01:18
 * @LastEditors: jixuanyu
 * @Description: file content
-->
<template>
  <!-- :default-visible="defaultVisible" -->
  <a-tooltip
    v-model:visible="visible1"
    :title="title"
    :arrow-point-at-center="arrowPointAtCenter"
    :auto-adjust-overflow="autoAdjustOverflow"
    :color="color"
    :destroy-tooltip-on-hide="destroyTooltipOnHide"
    :get-popup-container="getPopupContainer"
    :mouse-enter-delay="mouseEnterDelay"
    :mouse-leave-delay="mouseLeaveDelay"
    :overlay-class-name="overlayClassName"
    :overlay-style="overlayStyle"
    :placement="placement"
    :trigger="trigger"
  >
    <template v-if="$slots.title" #title>
      <slot name="title" />
    </template>
    <slot name="default" />
  </a-tooltip>
</template>

<script>
import { defineComponent, computed } from 'vue'
import { Tooltip } from 'ant-design-vue'
export default defineComponent({
  name: 'ZTooltip',
  components: {
    ATooltip: Tooltip
  },
  props: {
    title: {
      type: String,
      default: undefined
    },
    arrowPointAtCenter: {
      type: Boolean,
      default: false
    },
    autoAdjustOverflow: {
      type: Boolean,
      default: true
    },
    color: {
      type: String,
      default: undefined
    },
    // defaultVisible: {
    //   type: Boolean,
    //   default: false
    // },
    destroyTooltipOnHide: {
      type: Boolean,
      default: false
    },
    mouseEnterDelay: {
      type: Number,
      default: 0.1
    },
    mouseLeaveDelay: {
      type: Number,
      default: 0.1
    },
    overlayClassName: {
      type: String,
      default: undefined
    },
    overlayStyle: {
      type: Object,
      default: undefined
    },
    placement: {
      type: String,
      default: 'top'
    },
    trigger: {
      type: String,
      default: 'hover'
    },
    visible: {
      type: Boolean,
      default: undefined
    },
    getPopupContainer: {
      type: Function,
      default: undefined
    }
  },
  setup(props, _ref) {
    const visible1 = computed({
      get() {
        return props.visible
      },
      set(val) {
        _ref.emit('update:visible', val)
      }
    })
    return { visible1 }
  }
})
</script>
